﻿
<script type="text/html" id="toolbarDemo">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm" lay-event="getCheckData">获取选中行数据</button>
        <button class="layui-btn layui-btn-sm" lay-event="">增加</button>
        <button class="layui-btn layui-btn-sm" lay-event="">编辑</button>
        <button class="layui-btn layui-btn-sm" lay-event="">删除</button>
        <button class="layui-btn layui-btn-sm" lay-event="">修改权限</button>
    </div>
</script>

<script type="text/html" id="Tpl_accountStatus">
    <span class="StatusRender">{{ GetAccountStatus(d.state) }}</span>
</script>


<!--角色-->
<script type="text/html" id="Tpl_Roles">
    <span class="StatusRender">{{ GetAccountStatus(d.state) }}</span>
</script>
<!--部门-->
<script type="text/html" id="Tpl_Orgs">
    <span class="StatusRender">{{ GetAccountStatus(d.state) }}</span>
</script>


<script>
    layui.use('table', function () {
        var table = layui.table;
        table.render({
            elem: '#userTable'
            , url: '/admin/user/Models'
            , toolbar: '#toolbarDemo'
            , cellMinWidth: 80
            , response: {
                statusName: 'code' //规定数据状态的字段名称，默认：code
                , statusCode: 100 //规定成功的状态码，默认：0
                , msgName: 'msg' //规定状态信息的字段名称，默认：msg
                , countName: 'count' //规定数据总数的字段名称，默认：count
                , dataName: 'data'//规定数据列表的字段名称，默认：data
            }
            , parseData: function (res) { //res 即为原始返回的数据
                console.log(res);
                return {
                    "code": res.status, //解析接口状态
                    "msg": res.msg, //解析提示文本
                    "count": res.data.totalCount, //解析数据长度
                    "data": res.data.models //解析数据列表
                };
            }
            , cols: [[
                { type: 'radio' }
                , { field: 'accountName', title: '账号', sort: true }
                , { field: 'name', title: '姓名' }
                , { field: 'gender', title: '性别' }
                , { field: 'mobilePhone', title: '姓名' }
                , { field: '', title: '角色' }
                , { field: '', title: '部门' }
                , { field: '', title: '岗位' }
                , { field: 'creationTime', title: '创建时间' }
                , { field: 'state', title: '状态', align: 'center', templet: '#Tpl_accountStatus' }
                , { field: 'description', title: '备注' }
                , { field: '', title: '操作' }
            ]]
            , done: function (){
                UserStatusRender();
            }
            , page: true
        });
        //头工具栏事件
        table.on('toolbar(userTable)', function (obj) {
            var checkStatus = table.checkStatus(obj.config.id); //获取选中行状态
            switch (obj.event) {
                case 'getCheckData':
                    var data = checkStatus.data;  //获取选中行数据
                    layer.alert(JSON.stringify(data));
                    break;
            };
        });
    });
</script>